<template>
	<view class="height-screen relative">
		<image src="@/static/img/mineBg.png" style="height: 478rpx;width: 100vw;" class="absolute" />
		<cu-custom>
			<block slot="content">{{$t('tabBar.mine')}}</block>
		</cu-custom>
		<view class="grid gap margin-ht" style="margin-top: 20rpx;">
			<view class="flex align-center" @tap.stop="helper.routerNav('/pages/mine/userInfo')">
				<image :src="helper.handleImage(userInfo.avatar)" style="width: 115rpx;height: 115rpx;"
					class="round flex-shrink" mode="aspectFill"/>
				<view class="flex margin-left-sm flex-sub flex-direction">
					<text class="font-500 text-df text-black">{{userInfo.nickname}}</text>
					<image v-if="userInfo.gender == 0" src="@/static/img/sexType.png"
						style="width: 35rpx;height: 35rpx;" class="margin-top-xs" />
					<div v-else style="width: 35rpx;height: 35rpx;border-radius: 36rpx;background-color: #CBE3ED;text-align: center;line-height: 35rpx;">
						<u-icon name="man" color="#2979ff" size="18"></u-icon>
					</div>
				</view>
			</view>
			<view class="flex bg-white radius-sm padding-tb">
				<view class="flex flex-direction align-center flex-sub u-border-right"
					@tap.stop="helper.routerNav('/pages/mine/orderList',{current:1})">
					<text class="text-lg font-bold text-black">{{orderInfo.daizhifu}}</text>
					<text class="text-sm font-400 text-black margin-top-xs">{{$t('mine.daizhifu')}}</text>
				</view>
				<view class="flex flex-direction align-center flex-sub u-border-right"
					@tap.stop="helper.routerNav('/pages/mine/orderList',{current:2})">
					<text class="text-lg font-bold text-black">{{orderInfo.daishouhuo}}</text>
					<text class="text-sm font-400 text-black margin-top-xs">{{$t('mine.daishouhuo')}}</text>
				</view>
				<view class="flex flex-direction align-center flex-sub u-border-right"
					@tap.stop="helper.routerNav('/pages/mine/orderList',{current:4})">
					<text class="text-lg font-bold text-black">{{orderInfo.shouhou}}</text>
					<text class="text-sm font-400 text-black margin-top-xs">{{$t('mine.sale')}}</text>
				</view>
				<view class="flex flex-direction align-center flex-sub"
					@tap.stop="helper.routerNav('/pages/mine/orderList',{current:3})">
					<text class="text-lg font-bold text-black">{{orderInfo.yiwancheng}}</text>
					<text class="text-sm font-400 text-black margin-top-xs">{{$t('mine.success')}}</text>
				</view>
			</view>
			<view class="flex bg-white radius-sm padding-lg grid" style="gap: 50rpx;">
				<view class="flex align-center" @tap.stop="helper.routerNav('/pages/mine/couponList')">
					<image src="@/static/img/mine01.png" style="width: 38rpx;height: 29rpx;" />
					<text class="margin-left-lg text-black text-df font-400">{{$t('mine.myCoupon')}}</text>
				</view>
				<view class="flex align-center" @tap.stop="helper.routerNav('/pages/mine/collectList')">
					<image src="@/static/img/mine02.png" style="width: 38rpx;height: 32rpx;" />
					<text class="margin-left-lg text-black text-df font-400">{{$t('mine.myCollect')}}</text>
				</view>
				<view class="flex align-center" @tap.stop="helper.routerNav('/pages/mine/myGroupList')">
					<image src="@/static/img/mine03.png" style="width: 38rpx;height: 32rpx;" />
					<text class="margin-left-lg text-black text-df font-400">{{$t('mine.myGroup')}}</text>
				</view>
				<view class="flex align-center" @tap.stop="helper.routerNav('/pages/mine/pickAddress')">
					<image src="@/static/img/mine04.png" style="width: 38rpx;height: 36rpx;" />
					<text class="margin-left-lg text-black text-df font-400">{{$t('mine.address')}}</text>
				</view>
				<view class="flex align-center" @tap.stop="helper.routerNav('/pages/mine/pullNew')">
					<image src="@/static/img/mine05.png" style="width: 38rpx;height: 38rpx;" />
					<text class="margin-left-lg text-black text-df font-400">{{$t('mine.pullNew')}}</text>
				</view>
				<view class="flex align-center" @tap.stop="helper.routerNav('/pages/mine/feedBack')">
					<image src="@/static/img/mine06.png" style="width: 38rpx;height: 33rpx;" />
					<text class="margin-left-lg text-black text-df font-400">{{$t('mine.feedBack')}}</text>
				</view>
				<view class="flex align-center" @tap.stop="helper.routerNav('/pages/mine/custom')">
					<image src="@/static/img/mine07.png" style="width: 38rpx;height: 36rpx;" />
					<text class="margin-left-lg text-black text-df font-400">{{$t('mine.about')}}</text>
				</view>
				<view class="flex align-center" @tap.stop="helper.routerNav('/pages/mine/setting')">
					<image src="@/static/img/mine08.png" style="width: 38rpx;height: 35rpx;" />
					<text class="margin-left-lg text-black text-df font-400">{{$t('mine.setting')}}</text>
				</view>
			</view>
		</view>
		<tabBar :currentTabbar="3" />
	</view>
</template>

<script>
	import {
		getInfo,
		statistics
	} from '@/apis'
	import tabBar from '@/components/tabBar.vue'
	export default {
		components: {
			tabBar
		},
		data() {
			return {
				userInfo: {},
				orderInfo: {}
			}
		},
		onShow() {
			this.getInfo()
			this.statistics()
		},
		methods: {
			async getInfo() {
				const res = await getInfo()
				this.userInfo = res
			},
			async statistics() {
				const res = await statistics()
				this.orderInfo = res
			}
		}
	}
</script>

<style>
</style>